<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>04_元素溢出处理</title>
    <style>
        .overflow{
            background-color: lightgreen;
            width: 100px;
            height: 100px;
            overflow: visible;
            overflow: hidden;
            overflow: scroll;
            overflow: auto;
        }
        .txt{
            background-color: yellow;
            width: 300px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    </style>
</head>
<body>
<div class="txt">
    lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus aliquam animi asperiores at atque beatae consequatur consequuntur corporis culpa cum cumque debitis delectus dicta dignissimos distinctio dolorem dolores doloribus ducimus earum ea eaque eius eligendi enim eos esse eveniet exercitationem expedita facilis fuga fugiat fugit harum hic hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hiccup hic
</div>
<div class="overflow">
    <img src="img/1.png">
</div>
</body>
</html>